<template>
    <view class="page">
        <st-uni-tab-control :current="current" :values="items" bgc="#fff" :fixed="true" :isEqually='true'
                            @clickItem="onClickItem"/>
        <!-- 使用 swiper 配合 滑动切换 -->
        <view class="content">
            <view v-show="current === 0">
                <uni-list :border="true">
                    <uni-list-chat v-for=" item in getList" :avatar-circle="true"
                                   :title="item.userNickname"
                                   :key="item.id"
                                   :avatar="item.userAvatar" :note="item.userGenderDictName" :time="item.createAt"
                                   @click="$utils.n.ngt('/pages/detail/detail?userId=' + item.userId)"
                                   clickable/>
                </uni-list>

            </view>
            <view v-show="current === 1">
                <uni-list :border="true">
                    <uni-list-chat v-for=" item in getList" :avatar-circle="true"
                                   :title="item.userNickname"
                                   :key="item.id"
                                   :avatar="item.userAvatar" :note="item.userGenderDictName" :time="item.createAt"
                                   @click="$utils.n.ngt('/pages/detail/detail?userId=' + item.userId)"
                                   clickable/>
                </uni-list>
            </view>
            <uni-list :border="true" v-show="getList.length===0">
                <uni-list-item title="没有发现更多数据~" class="no-content"></uni-list-item>
            </uni-list>
        </view>
    </view>
</template>

<script>
    import StUniTabControl from "../../components/st-uni-tab-control/StUniTabControl"

    export default {
        components: {StUniTabControl},
        data() {
            return {
                current: 0,
                items: [
                    '男生',
                    '女生'
                ],
                listData: []
            };
        },
        computed: {
            getList() {
                let gender = this.current == 0? 'm' : 'f'
                let list = this.listData.filter(f => f.userGenderDictValue === gender) || []

                return list
            }
        },
        onLoad(option) {
            let self = this

            this.current = option.genderDictValue == 'm'?0:1
            const eventChannel = this.getOpenerEventChannel()
            // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
            eventChannel.on('participates', function (data) {
              console.log(data)
                self.listData = data
            })

            uni.setNavigationBarTitle({
                title: option.title || '活动参与'
            })
        },
        methods: {
            onClickItem(e) {
                if (this.current !== e.currentIndex) {
                    this.current = e.currentIndex
                }
            }
        }
    }
</script>

<style>
    page {
        height: 100%;
    }

    .page {
        padding-top:50px;
        height: 100%;
    }
</style>
